import React from "react";
import { Layout } from "antd";
import Header from "../components/layout/Header";
import HeroSection from "../components/home/HeroSection";
import FeaturesSection from "../components/home/FeaturesSection";
import StylesSection from "../components/sections/StylesSection";
import DemoSection from "../components/home/DemoSection";
import WorkflowSection from "../components/sections/WorkflowSection";
import TechSection from "../components/home/TechSection";
import TeamSection from "../components/home/TeamSection";
import CTASection from "../components/home/CTASection";
import Footer from "../components/layout/Footer";

const { Content } = Layout;

const HomePage = () => {
  return (
    <Layout className="app-layout">
      <Header />
      <Content>
        <div>
          <section className="fadeIn">
            <HeroSection />
          </section>
          <section className="fadeIn">
            <FeaturesSection />
          </section>
          <section className="fadeIn">
            <StylesSection />
          </section>
          <section className="fadeIn">
            <DemoSection />
          </section>
          <section className="fadeIn">
            <WorkflowSection />
          </section>
          <section className="fadeIn">
            <TechSection />
          </section>
          <section className="fadeIn">
            <TeamSection />
          </section>
          <section className="fadeIn">
            <CTASection />
          </section>
        </div>
      </Content>
      <Footer />
    </Layout>
  );
};

export default HomePage;
